import React, { Component, PropTypes } from 'react';
import Module from '../../lib/module'


import { Menu, Icon } from 'antd';
const SubMenu = Menu.SubMenu;
const MenuItemGroup = Menu.ItemGroup;

class PageHeader extends Module {
    constructor(props, context) {
        super(props, context);
        this.state = {
            current: 'home'
        };
        this.keyMap = {
            'home': '/',
            'CarStatus': '/CarStatus',
            'CarBaseInfo': '/CarBaseInfo',
            'FixRecord': '/FixRecord',
            'Screen': '/Screen',
            'VipData': '/VipData',
            'FindVip': '/FindVip',
            'ChangeVipData': '/ChangeVipData',
        };
        this.routerMap = {
            '/': 'home',
            '/CarStatus': 'CarStatus',
            '/CarBaseInfo': 'CarBaseInfo',
            '/CarDetailInfo': 'CarBaseInfo',
            '/FixRecord': 'FixRecord',
            '/Screen': 'Screen',
            '/VipData': 'VipData',
            '/FindVip': 'FindVip',
            '/ChangeVipData': 'ChangeVipData',
        };
    }

    componentDidMount() {
        let pathname = this.props.pathname;
        this.setState({
            current: this.routerMap[pathname]
        })
    }

    handleMenuClick = ({key}) => {
        console.log(key);
        this.setState({
            current: key
        }, () => {
            this.context.router.push({
                pathname: this.keyMap[key]
            })
        })
    }

    render() {
        let {current} = this.state;
        return <div className="N_header" style={{display:"inline-block"}}>
            <Menu
                theme="dark"
                mode="vertical-right"
                selectedKeys={[current]}
                onSelect={this.handleMenuClick}
            >
                <Menu.Item key="home">
                    首页
                </Menu.Item>
                <SubMenu key="sub2" title={<span><Icon type="appstore" /><span>车辆状态</span></span>}>
                    <Menu.Item key="CarStatus">Option 5</Menu.Item>
                </SubMenu>
                <SubMenu key="sub4" title={<span><Icon type="setting" /><span>比赛数据</span></span>}>
                    <Menu.Item key="Screen">Option 9</Menu.Item>
                </SubMenu>
                <SubMenu key="sub5" title={<span><Icon type="setting" /><span>会员数据</span></span>}>
                    <Menu.Item key="VipData">会员数据</Menu.Item>
                    <Menu.Item key="FindVip">查询会员</Menu.Item>
                    <Menu.Item key="ChangeVipData">修改数据</Menu.Item>
                </SubMenu>







            </Menu>
        </div>
    }
}

export default PageHeader;